<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
			<div>
				<span id="span01"></span><br />
				<span class="one" name="aaa"></span><br />
				<span></span><br />
				<span class="one" name="aaa"></span><br />
				<span></span><br />
				<span class="one"></span><br />
			</div>
			
			
			<script type="text/javascript">
				
				// 根据id查找 		getElemntById()
				// var span01 = document.getElementById("span01");
				span01.textContent = "O(∩_∩)O哈哈~";
				
				// 根据标签			getElementByTagName()
				var spans = document.getElementsByTagName("span");
				for(var i=0;i<spans.length;i++)
				{
					spans[i].textContent = "嘿嘿";
				}
				
				// 根据class查找
				var ones = document.getElementsByClassName("one");
				for(var i=0;i<ones.length;i++)
				{
					ones[i].style.background = "#00ff00";
				}
				
				var names = document.getElementsByName("aaa");
				for(var i=0;i<names.length;i++)
				{
					names[i].style.color = "#ffffff";
				}
				
				// querySelector("css选择器")   查找第一符合css选择器的元素
				// querySelectAll("css选择器")   查找所有符合css选择器的元素
				
				document.querySelector(".one").style.background = "#ff0000";
			</script>
		</body>
</html>
